import React, { PropTypes } from 'react';
import { Grid } from 'antd-mobile';
import { hashHistory} from 'react-router';
import request from '../../../utils/request';
import './less/index.less';

// const preference = constants.preference;
const propTypes = {
    columnNum: PropTypes.number.isRequired,
    data: PropTypes.array.isRequired,
    type: PropTypes.number.isRequired,
};

class GoodsGrid extends React.Component{

    goodsDetail = (goodsId,e) => {
        console.log(goodsId);
    }

    render(){
        return (

            <div>
                <div className="line"></div>
                <Grid data={this.props.data}
                      hasLine={false}
                      square={false}
                      columnNum={this.props.columnNum}
                      renderItem={dataItem => (
                          <div className="preference" onClick={this.goodsDetail.bind(this,dataItem.id)}>
                              <div style={{height:"100%"}}>
                                  <a href={dataItem.url} ><img src={dataItem.icon} style={{ width: '60%'}} alt=""/></a>
                                  <div className="goodsMsg">
                                      <div className="goodsTitle lineLimit">
                                          <span>{dataItem.name}</span>
                                      </div>
                                      <div className="price">
                                          <span>¥{dataItem.price}</span>
                                      </div>
                                      {this.props.type === 0
                                          ? '' :
                                          <div className="sellerNum" >
                                              <span>销量 {dataItem.sellerNum} | 已分销 {dataItem.distributorNum}</span>
                                          </div>
                                      }
                                  </div>
                              </div>
                          </div>
                      )}
                />
            </div>
        );
    }
}
GoodsGrid.propTypes = propTypes;
export default GoodsGrid;